<template>
    <teleport to="body">
        <div class="modal" @click="ModalComponent.Default.TrySetResult('')">
            <component class="dynamic" @click.stop="" v-bind:is="ModalComponent.Default.DynamicComponent()" />
        </div>
    </teleport>
</template>

<script setup lang="ts">
import ModalComponent from '@runtime/module/Modal/ModalComponent';
</script>

<style scoped>
.modal {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;

    backdrop-filter: blur(1rem);
}

.dynamic {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
</style>